<!DOCTYPE html>
<html lang="ar">

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>">

    <script src="<?= STATIC_PATH ?>/comm.js?date=<?= $H = date('H') ?>"></script>
    <script src="<?= get_template_directory_uri() ?>/base.js?date=ss<?= $H ?>"></script>


    <?php
    if (is_front_page() || is_home()) {
        $title = get_bloginfo('name');
    } elseif (is_category()) {
        $catInfo = get_category(get_queried_object_id());
        $title =  $catInfo->name . ' - ' . get_bloginfo('name');
    } elseif (is_single()) {
        $title = the_title('', '', false);
        $description = strip_tags(mb_substr(get_the_content(),0,160));
    } else {
        $title = 'other';
    }

    ?>
    <title><?= $title ?></title>
    <?php if (isset($description) && !empty($description)): ?>
        <?= '<meta name="description" content="' . $description . '">' ?>
    <?php endif; ?>

</head>

<?php
$categories = get_categories(array(
    'taxonomy'   => 'category',
    'hide_empty' => false, // Include empty categories
    'orderby'    => 'name',
    'order'      => 'ASC',
));

?>

<body>
    <div class="mask"></div>
    <header>
        <div class="topmenu grid">
            <button class="switch"></button>
            <nav class="grid">
                <?php foreach ($categories as $vo): ?>
                    <?php if (intval($vo->parent) == 0): ?>
                        <a href="/category/<?= $vo->slug ?>"><?= $vo->name ?></a>
                    <?php endif; ?>
                <?php endforeach; ?>
            </nav>
            <h1><a href="/"><?= get_bloginfo('name'); ?></a></h1>
            <img src="<?= bloginfo('template_directory') ?>/imgs/menu.svg">
        </div>
    </header>

    <section id='ballnew' style='padding:var(--gap);'>
        <a href="https://egyball1.com/" data-no>
            <img src="/wp-content/themes/blocks/imgs/banner_egyball1.gif" style="cursor: pointer;" alt="banner" loading="lazy">
        </a>
    </section>

    <main>